<template>
    <div class="guanliyuanguanli">
        <div class="top">
            <div class="name">管理员管理</div>
            <a href="javascript:;" :class="{'check':ischeck==1}" @click="guanliyuanList">管理员列表</a>
            <a href="javascript:;" :class="{'check':ischeck==2}" @click="jueseguanli">角色管理</a>
        </div>
        <div class="bottom">
            <router-view></router-view>
        </div>
    </div>
</template>

<script>
import EditableCell from './EditableCell'

export default {
    name:'guanliyuanguanli',
    components:{
        EditableCell,
    },
    data() {
        return {
            ischeck:0,
            searchValue:'',

        }
    },
    methods: {
        guanliyuanList(){
            this.ischeck=1
            this.$router.push('/manage/guanliyuanguanli/guanliyuanliebiao')
        },
        jueseguanli(){
            this.ischeck=2
            this.$router.push('/manage/guanliyuanguanli/guanliyuanliebiao')
        }
    },
    mounted() {


    },
}
</script>

<style lang="scss">
    .guanliyuanguanli{
        display: flex;
        flex-direction: column;
        width: calc(100vw - 256px);
    .top{
        width: 100%;
        height: 93px;
        background-color: #fff;
        margin-bottom: 10px;
        margin-top: 10px;
        .name{
            height: 68px;
            font-size: 20px;
            padding: 18px;
        }
        a{
            margin-left: 65px;
            padding-bottom: 5px;
            color: #000;
            &.check{
                color: #1990FE;
                border-bottom:2px solid #1990FE;
            }
        }
    }
        .editable-cell {
        position: relative;
        }

        .editable-cell-input-wrapper,
        .editable-cell-text-wrapper {
        padding-right: 24px;
        }

        .editable-cell-text-wrapper {
        padding: 5px 24px 5px 5px;
        }

        .editable-cell-icon,
        .editable-cell-icon-check {
        position: absolute;
        right: 0;
        width: 20px;
        cursor: pointer;
        }

        .editable-cell-icon {
        line-height: 18px;
        display: none;
        }

        .editable-cell-icon-check {
        line-height: 28px;
        }

        .editable-cell:hover .editable-cell-icon {
        display: inline-block;
        }

        .editable-cell-icon:hover,
        .editable-cell-icon-check:hover {
        color: #108ee9;
        }

        .editable-add-btn {
        margin-left: 18px;
        margin-bottom: 30px;
        margin-right: 700px;

        }
    }




</style>